<!--
 * @Descripttion: 
 * @version: 
 * @Author: kk
 * @Date: 2020-10-22 22:01:18
 * @LastEditors: kk
 * @LastEditTime: 2020-10-30 11:36:47
-->
<template>
  <div class="dashboard-container">
    <div> <h1>首页</h1> </div>
    <div class="dashboard-text">
      name: {{ name }}
      role: {{ role.roleName}}
    </div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import role from '@/api/role'

export default {
  name: 'Dashboard',
  computed: {
    ...mapGetters([
      'name',
    ])
  },
  data(){
    return {
      role:{},
      roleId: '',
    }
  },
  methods: {
     getRole(){
       role.getRole(this.roleId).then(response =>{
         this.role=response.data.role
       })
     }
  },
  created() {
    this.roleId=this.$store.getters.roleId
    this.getRole()
    
  },
}
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }
  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}
</style>
